import React, {PureComponent} from 'react'
import {ScrollView,Dimensions, StyleSheet, DeviceEventEmitter,View, Text, TouchableOpacity, Button, Animated,Image} from 'react-native'

const {width} = Dimensions.get('window')
import { observer } from 'mobx-react/native';
import { action, autorun, observe } from 'mobx';
import method from "../../api/method";
import api from "../../api/api";
import {fetchGetRequest} from "../../api/NetworkTool";

type Props = {
    itemData:Object,
    data:Object,
    isShow:Function,
}

@observer
export default class MineShopCell extends PureComponent<Props>{


    componentDidMount() {
        this.subscription = DeviceEventEmitter.addListener('allSelect', (isSelAll) => {
            this.itemData.isSelect = isSelAll;
        })

    }
    constructor(props) {
        super(props);
        this.itemData = this.props.itemData;


    };
    componentWillUnmount() {
        this.subscription && this.subscription.remove();
    };

    @action
    selectPress = () => {
        this.itemData.isSelect = !this.itemData.isSelect;
        let money = this.itemData.price;
        if (this.itemData.isSelect) {
            this.props.data.increase(money);
        }
        else {
            this.props.data.reduce(money)
        }
        this.props.data.itemPress();
    };
    // setMoney (money){
    //     if (this.props.money) {
    //
    //         this.props.money(money);
    //     }
    // };
    render() {
        let course = this.props.itemData
        // let { isSel, price ,  } = this.state;

        // let coupon = course.coupon
        let start_time = course.start_date.substr(5,5).replace('-','月')+'日'
        let end_time = course.end_date.substr(5,5).replace('-','月')+'日'
        let mas_ta = course.teacher[0]
        let tou_ta = course.teacher[1]
        // var coupon_title = ''
        // var coupon_price = '无优惠券可用'
        // if (coupon.price){
        //     coupon_title = coupon.title
        //     coupon_price = '此券可用，去结算立减'+coupon.price+'元'
        // }
        return <View style={{backgroundColor:'white'}}>
            <View style={{marginLeft: 12, marginRight: 12,backgroundColor:'white'}}>
                <View style={{flexDirection:'row', alignItems:'center',justifyContent:'center'}}>
                    <TouchableOpacity onPress={this.selectPress } style={{marginRight:12,
                        marginLeft:-10,marginTop:12,justifyContent:'center',alignItems:'center',width:30,height:40}}>
                        <Image style={{width:10,height:10}} source={this.itemData.isSelect  ?
                            require('../../../res/img/detail/detail_select.png')
                            : require('../../../res/img/detail/detail_un_select.png')}/>
                    </TouchableOpacity>

                    <View>
                        <View style={{flexDirection: 'row', backgroundColor: 'white', marginTop: 10,alignItems:'center'}}>
                            <Text numberOfLines={1} style={styles.title}>{course.title}</Text>
                        </View>
                        <View style={{flexDirection: 'row', backgroundColor: 'white', marginTop: 10, alignItems: 'center',}}>
                            <Image style={{width: 12, height: 12}} source={require('../../../res/img/select/select_time.png')}/>
                            <Text style={[styles.time, {marginLeft: 7}]}>{start_time+'到'+end_time+course.frequency+course.start_time+'-'+course.end_time}</Text>
                        </View>
                        <View style={{flexDirection: 'row', backgroundColor: 'white', marginTop: 8, alignItems: 'flex-end',}}>
                            <View style={{flexDirection: 'row', alignItems: 'center',}}>
                                <Image style={{width: 28, height: 28, borderRadius: 14}}
                                       source={{uri:mas_ta.image}}/>
                                <View style={{marginLeft: 10, justifyContent: 'center', height: 28}}>
                                    <Text style={styles.teacher}>讲师</Text>
                                    <Text style={styles.teacher_show}>{mas_ta.realname}</Text>
                                </View>
                            </View>
                            <View style={{flexDirection: 'row', alignItems: 'center', marginLeft: 30}}>
                                <Image style={{width: 28, height: 28, borderRadius: 14}}
                                       source={{uri:tou_ta.image}}/>
                                <View style={{marginLeft: 10, justifyContent: 'center', height: 28}}>
                                    <Text style={styles.teacher}>辅导</Text>
                                    <Text style={styles.teacher_show}>{tou_ta.realname}</Text>
                                </View>
                            </View>
                        </View>
                    </View>
                </View>
                <TouchableOpacity style={{marginTop: 10, flex: 1, height: 24, width: width,marginBottom:15}} onPress={()=>{
                    this.props.isShow(true)
                }}>
                    <Image style={{width: (width - 24), height: 24, position: 'absolute'}}
                           source={require('../../../res/img/detail/order_course_bg.png')}/>
                    <View style={{marginTop: 9, flexDirection: 'row', paddingLeft: 8}}>
                        <Text style={{color: '#DB3843', fontSize: 10, marginTop: 1}}>11</Text>
                        <Text style={{color: '#333333', fontSize: 10, marginLeft: 8}}>111</Text>
                    </View>
                </TouchableOpacity>
            </View>
        </View>
    }



}

const styles = StyleSheet.create({
    title:{
        fontWeight:'bold',
        color:'rgba(0,0,0,0.8)',
        fontSize:16,
        width:(width -100),
    },
    time:{
        fontSize:12,
        color:'rgba(0,0,0,0.5)',
        fontWeight:'200',
    },
    teacher:{
        fontSize:9,
        color:'rgba(0,0,0,0.4)',
    },
    teacher_show:{
        fontSize:9,
        color:'rgba(0,0,0,0.8)',
        marginTop:4,
    },
    price:{
        color:'rgba(197, 50, 60, 1)',
        fontSize:19,
        fontWeight:'700',
        marginLeft:6,
    }
})